var canvas;
function draw() {
	
	if(canvas == null){
		canvas = document.createElement('canvas');
	}
	document.body.appendChild(canvas);
	canvas.style.position = 'absolute';
	canvas.style.left="0px";
	canvas.style.top="25px";
	canvas.style.zIndex="100";
	canvas.style.width="100%";
	canvas.style.height="100%";
	canvas.width=canvas.offsetWidth;
	canvas.height=canvas.offsetHeight;

	ctx = canvas.getContext('2d');
	ctx.beginPath();
	ctx.lineCap = "round";

//	You can change the color or width of the pen to modify following expression.
	ctx.strokeStyle = "rgba(255, 128, 64, 0.1)";
	ctx.lineWidth = 5;

	canvas.onmousedown = function (e) {
		this.pendown = true
	}
	canvas.onmouseup = function (e) {
		ctx.beginPath();
		this.pendown = false
	}
	canvas.onmousemove = function (e) {
		if (this.pendown) {
			ctx.lineTo(e.pageX - this.offsetLeft, e.pageY - this.offsetTop);
			ctx.stroke();
		} else {
			ctx.moveTo(e.pageX - this.offsetLeft, e.pageY - this.offsetTop);
		}
	}
}

function erase(){
	ctx = canvas.getContext('2d');
	ctx.strokeStyle = "rgba(255, 255, 255, 0.1)";
	ctx.lineWidth = 32;
}
function eraseAll(){
	ctx = canvas.getContext('2d');
	ctx.closePath();
	ctx.clearRect(0, 0, canvas.width, canvas.height);
	canvas.style.zIndex="-100";
}
